<template>
    <div>
        <el-row>
            <el-col :span="24">
                <el-form :inline="true">
                    <el-form-item label="请输入姓名">
                        <el-input v-model="tworkParam.wkName" placeholder="请输入姓名"></el-input>
                    </el-form-item>
                    <el-form-item label="请选择部门">
                        <el-select v-model="tworkParam.wkHdepartmentid" placeholder="请选择部门" @change="  handleDepartmentChange">
                            <el-option v-for="type in this.DepartType" :key="type.id" :label="type.ptDepName"
                                :value="type.id"></el-option>

                        </el-select>
                    </el-form-item>

                    <el-form-item label="请选择科室">
                        <el-select v-model="tworkParam.wkDepartmentid" placeholder="请选择科室">
                            <el-option v-for="type in HdepartType" :key="type.id" :label="type.deName"
                                :value="type.id"></el-option>

                        </el-select>
                    </el-form-item>



                    <el-form-item>
                        <el-button type="primary" @click="queryCondition">查询</el-button>
                    </el-form-item>
                </el-form>
            </el-col>
        </el-row>
        <el-row>

            <el-col :span="4">
                <el-button type="primary" icon="el-icon-share" @click="dialogFormVisible1 = true">新增员工</el-button>


            </el-col>

        </el-row>
        <el-dialog title="新增员工" :visible.sync="dialogFormVisible1">
            <el-form>
                <el-form-item label="账号" label-width="100px">
                    <el-input v-model="wkAccout"></el-input>
                </el-form-item>
                <el-form-item label="密码" label-width="100px">
                    <el-input v-model="wkPassword"></el-input>
                </el-form-item>
                <el-form-item label="姓名" label-width="100px">
                    <el-input v-model="wkName"></el-input>
                </el-form-item>
                <el-form-item label="年龄" label-width="100px">
                    <el-input v-model="wkAge"></el-input>
                </el-form-item>
                <el-form-item label="手机号" label-width="100px">
                    <el-input v-model="wkPhone"></el-input>
                </el-form-item>
                <el-form-item label="邮箱" label-width="100px">
                    <el-input v-model="wkEmail"></el-input>
                </el-form-item>
                <!-- 单选框 -->
                <input type="radio" value="男" v-model="wkGender">男
                <input type="radio" value="女" v-model="wkGender">女

                <el-form-item label="薪水" label-width="100px">
                    <el-input v-model="wkSalary"></el-input>
                </el-form-item>
                <el-form-item label="请选择部门">
                    <el-select v-model="tworkParam.wkHdepartmentid" placeholder="请选择部门"
                        @change=" handleDepartmentChange">
                        <el-option v-for="type in DepartType" :key="type.id" :label="type.ptDepName"
                            :value="type.id"></el-option>

                    </el-select>
                </el-form-item>
                <el-form-item label="请选择科室">
                    <el-select v-model="tworkParam.wkDepartmentid" placeholder="请选择科室" @change="handleRoleChange">
                        <el-option v-for="type in HdepartType" :key="type.id" :label="type.deName"
                            :value="type.id"></el-option>

                    </el-select>
                </el-form-item>
             
                <el-form-item label="请选择职位">
                    <el-select v-model="tworkParam.wkRoleid" placeholder="请选择职位" >
                        <el-option v-for="type in RoleType" :key="type.id" :label="type.rname"
                            :value="type.id"></el-option>

                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible1 = false">取消</el-button>
                <el-button type="primary" @click="save">确 定</el-button>
            </div>
        </el-dialog>


        <el-dialog title="编辑" :visible.sync="dialogFormVisible">
            <el-form  :model="tWork">
                <el-form-item label="账号" label-width="100px">
                    <el-input v-model="tWork.wkAccout"></el-input>
                </el-form-item>
                <el-form-item label="密码" label-width="100px">
                    <el-input v-model="tWork.wkPassword"></el-input>
                </el-form-item>
                <el-form-item label="姓名" label-width="100px">
                    <el-input v-model="tWork.wkName"></el-input>
                </el-form-item>
                <el-form-item label="年龄" label-width="100px">
                    <el-input v-model="tWork.wkAge"></el-input>
                </el-form-item>
                <el-form-item label="手机号" label-width="100px">
                    <el-input v-model="tWork.wkPhone"></el-input>
                </el-form-item>
                <!-- 单选框 -->
                <input type="radio" value="男" v-model="tWork.wkGender">男
                <input type="radio" value="女" v-model="tWork.wkGender">女

                <el-form-item label="薪水" label-width="100px">
                    <el-input v-model="tWork.wkSalary"></el-input>
                </el-form-item>
                <el-form-item label="请选择部门">
                    <el-select v-model="tWork.wkHdepartmentid" placeholder="请选择部门"
                        @change=" bbbb">
                        <el-option v-for="type in DepartType" :key="type.id" :label="type.ptDepName"
                            :value="type.id"></el-option>

                    </el-select>
                </el-form-item>
                <el-form-item label="请选择科室">
                    <el-select v-model="tWork.wkDepartmentid" placeholder="请选择科室" @change="aaa">
                        <el-option v-for="type in HdepartType" :key="type.id" :label="type.deName"
                            :value="type.id"></el-option>

                    </el-select>
                </el-form-item>
                <el-form-item label="请选择职位">
                    <el-select v-model="tWork.wkRoleid" placeholder="请选择职位" >
                        <el-option v-for="role in RoleType" :key="role.id" :label="role.rname"
                            :value="role.id" ></el-option>

                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取消</el-button>
                <el-button type="primary" @click="update">确 定</el-button>
            </div>
        </el-dialog>

        <el-row>
            <el-col :span="24">
                <el-table :data="tableData" @selection-change="handleSelectionChange" style="width: 100%">
                    <el-table-column type="selection" width="55">
                    </el-table-column>

                    <el-table-column prop="wkAccout" label="账号" align="center" width="180">
                    </el-table-column>

                    <el-table-column prop="wkName" label="姓名" align="center" width="180">
                    </el-table-column>
                    <el-table-column prop="wkGender" label="性别" align="center" width="180">
                    </el-table-column>
                    <el-table-column prop="deName" label="科室" align="center" width="180">
                    </el-table-column>
                    <el-table-column prop="rname" label="职位" align="center" width="180">
                    </el-table-column>
                    <el-table-column prop="ptDepName" label="部门" align="center" width="180">
                    </el-table-column>
                    <el-table-column prop="wkEmail" label="邮箱" align="center" width="180">
                    </el-table-column>


                    <el-table-column prop="wkIndate" label="入职时间" align="center" width="180">
                    </el-table-column>

                    <el-table-column prop="wkStatus" label="状态" align="center" width="180">
                        <template slot-scope="scope">
                            <span>
                                {{ scope.row.wkStatus == 1 ? '在职' : '离职' }}
                            </span>
                        </template>
                    </el-table-column>


                    <el-table-column label="操作">
                        <template slot-scope="scope">
                            <el-button type="primary" icon="el-icon-share"
                                @click="queryEmpId(scope.row.id)">修改员工</el-button>

                        </template>

                    </el-table-column>
                </el-table>

            </el-col>
        </el-row>
        <el-row>
            <el-col :span="24">
                <!-- 放分页 -->
                <el-pagination background :page-sizes="[4, 10, 20, 50]" :page-size="pageSize" :current-page="pageNum"
                    @next-click="nextPage" @prev-click="prevPage" @size-change="handleSizeChange"
                    @current-change="handleCurrentChange" layout=" total,sizes,prev, pager, next" :total="total">
                </el-pagination>
            </el-col>

        </el-row>
    </div>
</template>

<script>
export default {
    data() {
        return {
            tWork:{},
            pageNum: "1",
            pageSize: "4",
            total: 0,
            tableData: [],
            wkAccout: "",
            wkPassword: "",
            wkName: "",
            wkAge: "",
            wkPhone: "",
            wkSalary: "",
            wkGender: "",
            wkEmail:"",

            selectionData: [],
            dialogFormVisible:false,
            dialogFormVisible1:false,
            DepartType: [],
            RoleType: [],
            HdepartType: [],
            tworkParam: {
                id: "",
                wkDepartmentid: "",
                wkHdepartmentid: "",
                wkName: "",
                wkRoleid: "",
                TdeList:[],
                RoleList:[]

            },

        }
    },
    methods: {
        prevPage(val) {
            this.pageNum = val;
            this.queryAd();
        },
        nextPage(val) {
            //点击下一页触发

            this.pageNum = val;
            this.queryAd();
        },
        queryCondition() {
            this.pageNum = 1;
            this.queryAd();
        },
        handleSizeChange(val) {
            //改变每页条数触发
            this.pageNum = 1;
            this.pageSize = val;
            this.queryAd();
        },
        handleCurrentChange(val) {
            this.pageNum = val;
            this.queryAd();


        },

        handleSelectionChange(val) {
            console.log(val)
            //选中的对象数组
            this.selectionData = val;

        },



        queryAd() {
            let pageParam = {}
            pageParam.pageNum = this.pageNum
            pageParam.pageSize = this.pageSize
            pageParam.param = this.tworkParam
            this.$axios.post('api/hospitalEmployee/queryTWorkAll', pageParam)
                .then(res => {
                
                    if (res.data.code == 200) {
                        this.tableData = res.data.data.list;
                        this.pageNum = res.data.data.pageNum
                        this.pageSize = res.data.data.pageSize
                        this.total = res.data.data.total
                        console.log(this.tableData)
                    }
                })
        },
        handleHDepartmentChange() {
            this.$axios.get('api/hospitalEmployee/queryPtAll')
                .then(res => {
                   
                    if (res.data.code == 200) {
                        this.DepartType = res.data.data
                        console.log(this.DepartType)
                    }
                })
        },
        //根据部门查科室
        handleDepartmentChange() {
           
            let param = {};
            param.wkHdepartmentid  = this.tworkParam.wkHdepartmentid
            this.$axios.post('api/hospitalEmployee/queryTdeAll',param)
                .then(res => {
                    
                    if (res.data.code == 200) {
                        this.HdepartType = res.data.data
                    }
                })
        },
        //根据科室查职称
        handleRoleChange() {
            let param = {};
             param.wkDepartmentid = this.tworkParam.wkDepartmentid
            this.$axios.post('api/hospitalEmployee/queryTrAll', param)
                .then(res => {
                    if (res.data.code == 200) {
                        this.RoleType = res.data.data
                    }
                })
        },
        
        update(id){
            
            let param={}
             param.id = id
          
            param.wkAccout=this.tWork.wkAccout
            param.wkPassword=this.tWork.wkPassword
            param.wkName=this.tWork.wkName
            param.wkAge=this.tWork.wkAge
            param.wkPhone=this.tWork.wkPhone
            param.wkSalary=this.tWork.wkSalary
            param.wkGender=this.tWork.wkGender
            param.wkDepartmentid=this.tWork.wkDepartmentid
            param.wkHdepartmentid=this.tWork.wkHdepartmentid
            param.wkRoleid=this.tWork.wkRoleid

            
            this.$axios.post('api/hospitalEmployee/updateTWork', this.tWork)
                .then(res => {
                    
                    if (res.data.code == 200) {
                        this.$message.success("修改成功")
                        this.dialogFormVisible = false;
                        this.work={}
                        this.queryCondition()
                    }else{
                        this.$message.error("修改失败")
                    }
                })


        },
        queryTde(){
            this.$axios.get('api/ward/queryTde')
            .then(res=>{
                if (res.data.code == 200) {
                    this.TdeList = res.data.data
                }
            })
        },
        queryRoleAll(){
            this.$axios.get('api/hospitalEmployee/queryRoleAll')
            .then(res=>{
                if (res.data.code == 200) {
                    this.RoleList = res.data.data
                }
            })

        },
        queryEmpId(id){
            this.dialogFormVisible = true;
            
            
            let param={}
            param.id=id
            this.$axios.post('api/hospitalEmployee/queryByEmpId', param)
            .then(res=>{
                if(res.data.code == 200){
                    this.tWork=res.data.data;
                   
                    this.tworkParam.wkHdepartmentid = this.tWork.wkHdepartmentid;
                    this.tworkParam.wkDepartmentid = this.tWork.wkDepartmentid;
                    this.handleRoleChange();
                    this.handleDepartmentChange();
                    console.log(this.RoleType)
       
                    // this.HdepartType = res.data.data
                    // this.RoleType = res.data.data
                }
            })
            
        },
        save() {
            let param={}
          
            param.wkAccout=this.wkAccout
            param.wkPassword=this.wkPassword
            param.wkName=this.wkName
            param.wkAge=this.wkAge
            param.wkPhone=this.wkPhone
            param.wkSalary=this.wkSalary
            param.wkGender=this.wkGender
            param.wkDepartmentid=this.tworkParam.wkDepartmentid
            param.wkHdepartmentid=this.tworkParam.wkHdepartmentid
            param.wkRoleid=this.tworkParam.wkRoleid
            this.$axios.post('api/hospitalEmployee/addTWork',param)
            .then(res=>{
                if(res.data.code==200){
                    this.$message.success("添加成功")
                    this.dialogFormVisible1 = false;
                    this.work={}
                    this.queryAd()
                }else{
                    this.$message.error("添加失败")
                }
            })

       
        },
        aaa(){
            this.tworkParam.wkDepartmentid = this.tWork.wkDepartmentid;

            this.handleRoleChange();
        
        },
        bbbb(){
            this.tworkParam.wkHdepartmentid = this.tWork.wkHdepartmentid;
            this.handleDepartmentChange();
        }


    },
    created() {
        this.queryAd();
       this.handleHDepartmentChange();
    //    this.queryTde()
    //    this.queryRoleAll()

    }
}
</script>

<style scoped></style>